import React, { useContext } from "react"

import { create } from 'zustand'

const useBearStore = create((set) => ({
    bears: 0,
    increasePopulation: () => set((state) => ({ bears: state.bears + 1 })),
    removeAllBears: () => set({ bears: 0 }),
}))
export default function Report() {

    const bears = useBearStore((state) => state.bears)

    const increasePopulation = useBearStore((state) => state.increasePopulation)


    return (
        <div>
            1231231
            <h1>{bears} around here ...</h1>
            <button onClick={increasePopulation}>one up</button>
        </div>
    )

}